<template>
    <div>
        <el-dropdown :hide-on-click="false" style="float:right;font-size:18px;right:20px;">
            <span class="el-dropdown-link">
                <i class="el-icon-more" @click.stop="mapClick()"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
                <el-dropdown-item @click.native="handleEdit()">
                    编辑
                </el-dropdown-item>
            </el-dropdown-menu>
        </el-dropdown>

        <el-dialog title="编辑部门" :visible.sync="dialogFormVisible">
            <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="70px" style="width: 400px; margin-left: 50px">
                <el-form-item label="部门名称" prop="name" label-width="100px">
                    <el-input v-model="temp.name" type="text    " />
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">
                    {{ $t("table.cancel") }}
                </el-button>
                <el-button type="primary" @click="updateData()">
                    {{ $t("table.confirm") }}
                </el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { update } from '@/scrm/api/department/department'
export default {
    props: {
        department: {
            type: Object,
            default: {}
        }
    },
    data() {
        return {
            dialogFormVisible: false,
            temp: {
                name: ''
            },
            rules: {
                name: [
                    { required: true, message: '请输入部门名称', trigger: 'change' }
                ]
            }
        }
    },
    created() {
        this.temp.name = this.department.name
    },
    methods: {
        mapClick() {

        },
        handleEdit() {
            this.dialogFormVisible = true
        },
        updateData() {
            this.$refs['dataForm'].validate((valid) => {
                if (valid) {
                    let data = Object.assign({}, this.department, {name: this.temp.name})
                    update(data).then(res => {
                        if(res.errorCode == 200) {
                            this.$notify({
                                title: '编辑部门',
                                message: '修改成功',
                                type: 'success'
                            })
                            this.dialogFormVisible = false
                            this.$emit('editDepartment')
                        } else {
                            this.$notify({
                                title: '编辑部门',
                                message: '修改失败',
                                type: 'error'
                            })
                        }
                    })
                }
            })
        }
    }
}
</script>

<style scoped lang="scss">

</style>